<script setup lang="ts">
import { ref, reactive } from "vue";
import { HxqDetailImage } from "vue-mobile-hxq";
import imgs from "@/assets/images/logo.png";

type listInfo = {
  img: string[];
};
interface Info {
  val: {
    info: listInfo;
  };
}
//模拟获取到数据
const detail = reactive<Info>({
  val: {
    info: {
      img: [],
    },
  },
});

//赋值
detail.val = {
  info: {
    img: [imgs, imgs, imgs, imgs],
  },
};
const { img } = detail.val.info;
</script>
<template>
  <div class="public-flex-box">
    <div class="public-phone-title">基本展示</div>
    <div class="public-usage-box">
      <hxq-detail-image name="店铺图片" :value="img" />
    </div>
  </div>
</template>

<style lang="scss" scoped>
.van-checkbox-group {
  display: flex;
  justify-content: space-between;
  ::v-deep .van-checkbox {
    height: 48px;
    line-height: 48px;
    // border-bottom: 1px solid #eeeeee;
  }
  ::v-deep .van-checkbox:last-child {
    border-bottom: none;
  }
}
.padding-flex-box {
  background: #fff;
  border-radius: 20px;
  margin-bottom: 20px;
  .public-phone-title {
    padding-left: 20px;
  }
}
</style>
